<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>游园拾忆</title>
    <link rel="icon" href="/src/image/public.png">
    <link rel="stylesheet" href="/src/public.css"/>
    <link rel="stylesheet" href="/src/page/new_tab/new_tab.css"/>
</head>
<body>
<div class="app" id="app">
    <div class="other-div">
        <div class="search-div">
            <img class="search-icon-left" id="searchId" src="/src/image/baidu.ico" alt="" title="点击切换搜索引擎"/>
            <input id="searchInput" class="search-input" type="text"/>
            <img class="search-icon-right" id="searchBtn" src="/src/image/search.png" alt=""/>
        </div>
    </div>
    <div class="nav-div" id="navRoot"></div>
    <div class="diandiandian" id="diandiandian"></div>
</div>

<div id="itemMenu" class="item-menu">
    <div class="menu-item" id="optEditItem">重命名</div>
    <div class="menu-item" id="optDeleteItem">删除</div>
</div>

<div id="systemMenu" class="item-menu">
    <!-- <div class="menu-item">编辑</div> -->
    <div class="menu-item" id="optBackgroundImage">更换背景图</div>
    <div class="menu-item" id="optResetBackgroundImage">恢复默认背景图</div>
    <div class="menu-item" id="optResetCSS">恢复默认布局</div>
    <div class="menu-item" id="optSetting">设置</div>
</div>

<div class="prePage" id="prePage">
    <div class="optPageText">
        <svg t="1752122052327" class="icon" viewBox="0 0 1024 1024" version="1.1"
             xmlns="http://www.w3.org/2000/svg" p-id="12881" width="200" height="200">
            <path
                    d="M705.41777448 931.07184415l-420.4734225-420.47342249 420.4734225-420.47342166 37.84260773 37.84260772-382.63081394 382.63081394L743.26038221 891.82765808z"
                    p-id="12882"></path>
        </svg>
    </div>
</div>
<div class="nextPage" id="nextPage">
    <div class="optPageText">
        <svg t="1752122097900" class="icon" viewBox="0 0 1024 1024" version="1.1"
             xmlns="http://www.w3.org/2000/svg" p-id="13059" width="200" height="200">
            <path
                    d="M745.65898437 533.84433594l-416.32822265 416.32822265c-6.66298828 6.66298828-15.86689453 10.78330078-26.03408203 10.78330079-20.33349609 0-36.81738281-16.48388672-36.81738282-36.81738282 0-10.1671875 4.12119141-19.37109375 10.78330079-26.03408203l394.49355468-394.49355469-381.82675781-381.89707031c-6.07763672-6.2859375-9.82265625-14.86054687-9.82265625-24.30878906 0-19.32539062 15.66650391-34.99189453 34.99189453-34.99189453 9.44912109 0 18.02285156 3.74501953 24.31845703 9.83144531l395.88398438 395.88398438c4.78740234 4.87265625 8.14042969 11.16914062 9.36738281 18.19599609-0.759375-4.89814453 0.29003906-5.52919922 0.99052734-4.47978516 6.64277344 6.65859375 10.75078125 15.8484375 10.75078125 25.99892578 0 10.14960938-4.10800781 19.34033203-10.75166015 25.99892578z"
                    fill="#777D90" p-id="13060"></path>
        </svg>
    </div>
</div>

<div id="setting" class="setting">
    <div id="settingPage" class="setting-page">
        <div class="setting-title">设置</div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_item_height">数据备份</label>
            <div class="item-value">
                <button id="importData" class="opt-Btn import-Btn">导入数据</button>
                <button id="exportData" class="opt-Btn export-Btn">导出数据</button>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_bg_brightness">背景图亮度</label>
            <div class="item-value">
                <input id="slider_bg_brightness" class="setting-solid" type="range" min="0" max="100" value="80"
                       step="1"/>
                <span id="bg_brightness" class="solid-value">80</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_rows">每页行数</label>
            <div class="item-value">
                <input id="slider_grid_rows" class="setting-solid" type="range" min="1" max="10" value="4"
                       step="1"/>
                <span id="grid_rows" class="solid-value">4 行</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_columns">每页列数</label>
            <div class="item-value">
                <input id="slider_grid_columns" class="setting-solid" type="range" min="1" max="15" value="9"
                       step="1"/>
                <span id="grid_columns" class="solid-value">9 列</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_item_height">行间距</label>
            <div class="item-value">
                <input id="slider_grid_item_height" class="setting-solid" type="range" min="50" max="500" value="140"
                       step="1"/>
                <span id="grid_item_height" class="solid-value">140px</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_item_width">列间距</label>
            <div class="item-value">
                <input id="slider_grid_item_width" class="setting-solid" type="range" min="50" max="500" value="140"
                       step="1"/>
                <span id="grid_item_width" class="solid-value">140px</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_content_gap">网站图标与名称间距</label>
            <div class="item-value">
                <input id="slider_grid_content_gap" class="setting-solid" type="range" min="0" max="50" value="10"
                       step="1"/>
                <span id="grid_content_gap" class="solid-value">10px</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_icon_width">网站图标大小</label>
            <div class="item-value">
                <input id="slider_grid_icon_width" class="setting-solid" type="range" min="10" max="200" value="40"
                       step="1"/>
                <span id="grid_icon_width" class="solid-value">140px</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title" for="slider_grid_text_size">网站名称字体大小</label>
            <div class="item-value">
                <input id="slider_grid_text_size" class="setting-solid" type="range" min="10" max="50" value="15"
                       step="1"/>
                <span id="grid_text_size" class="solid-value">140px</span>
            </div>
        </div>
        <div class="setting-item">
            <label class="item-title">网站名称显示</label>
            <div class="item-value">
                <div class="item-group-item">
                    <input type="radio" class="setting-radio" id="showGridItemText" name="toggle" checked>
                    <label for="showGridItemText">显示</label>
                </div>
                <div class="item-group-item">
                    <input type="radio" class="setting-radio" id="hideGridItemText" name="toggle">
                    <label for="hideGridItemText">隐藏</label>
                </div>
            </div>
        </div>
    </div>
</div>

<div id="editing" class="editing">
    <div id="editingPage" class="editing-page">
        <div class="editing-title">编辑网站信息</div>
        <div class="editing-item">
            <label class="item-title" for="input_web_url">网站地址</label>
            <input id="input_web_url" class="input_web_item"/>
        </div>
        <div class="editing-item">
            <label class="item-title" for="input_web_name">网站名称</label>
            <input id="input_web_name" class="input_web_item"/>
        </div>
        <div class="editing-item">
            <label class="item-title" for="input_web_icon">网站图标</label>
            <input id="input_web_icon" class="input_web_item"/>
        </div>
        <div class="editing-item">
            <div class="btn-group">
                <button id="closeItemInfo" class="opt-Btn export-Btn">取消修改</button>
                <button id="updateItemInfo" class="opt-Btn import-Btn">保存修改</button>
            </div>
        </div>
    </div>
</div>

<input type="file" id="fileInput" accept="image/*" style="display:none;">

<script type="text/javascript" src="/src/database.js"></script>
<script type="text/javascript" src="/src/public.js"></script>
<script type="module" src="/src/page/new_tab/new_tab.js"></script>
<script type="text/javascript" src="/src/resize.js"></script>
</body>
</html>